<p:dialog xmlns="http://www.w3.org/1999/xhtml"
      	  xmlns:h="http://java.sun.com/jsf/html"
      	  xmlns:f="http://java.sun.com/jsf/core"
      	  xmlns:ui="http://java.sun.com/jsf/facelets"
      	  xmlns:p="http://primefaces.org/ui"
      	  modal="true"  resizable="true" width="40%"
		  widgetVar="dialogConsultarEstado" id="idDialogConsultarEstado" closable="true"
		  appendTo="@(body)" header="Consultar Estado" > 	
  	
<h:form id="formDialogConsultarEstado" prependId="false">
 	<p:messages id="messagesCidadeConsultarEstado" autoUpdate="true" closable="true" /> 
    	<h:panelGrid id="pgEstadoCidade" columns="4" style="text-align:center; margin-top:20px; margin-right:10%;">  
            <h:outputLabel value="Código" style="font-size:14px; float:left; padding-right:20px "/>  
            <h:outputLabel value="Estado" style="font-size:14px; float:left"/> 
            <h:outputLabel  />
            <h:outputLabel  />
            <p:inputText value="#{cidadeBean.cidade.estado.idEstado}" styleClass="inputId">
            	<p:ajax  listener="#{cidadeBean.onChange}" render="pgEstadoCidade" update="pgEstadoCidade"/>
            </p:inputText>  
  			<p:autoComplete  value="#{cidadeBean.cidade.estado.descricao}" 
                    completeMethod="#{cidadeBean.complete}" >
            	<p:ajax event="itemSelect" listener="#{cidadeBean.handleSelect}" update="pgEstadoCidade" />
			</p:autoComplete>   
    		<p:commandButton value="Consultar" actionListener="#{cidadeBean.findEstado}" update="dataTableEstado"
    				 			process="@this" styleClass="commandButton"/> 
    		<p:commandButton value="Novo" actionListener="#{cidadeBean.openDialogManterEstado}" 
    				 process="@this" styleClass="commandButton" ajax="true"/>
    	  	</h:panelGrid> 
    	
    <p:dataTable id="dataTableEstado" var="Estado" value="#{cidadeBean.dataModelEstado}"  
    			 rowKey="#{Estado.idEstado}"  selectionMode="single" style="padding-top:20px;">   
		<p:column style="width:4%; text-align:center;">  
            <f:facet name="header">  
                <h:outputText value="Código" />  
            </f:facet>  
            <h:outputText value="#{Estado.idEstado}" />  
        </p:column>  
  
        <p:column>  
            <f:facet name="header">  
                <h:outputText value="Nome do Estado" />  
            </f:facet>  
            <h:outputText value="#{Estado.descricao}" />  
        </p:column>  
        
        <p:column style="width:4%; text-align:center;">  
            <f:facet name="header">  
                <h:outputText value="Sigla" />  
            </f:facet>  
            <h:outputText value="#{Estado.sigla}" />  
        </p:column>  
        
        <p:column style="text-align:center">  
            <f:facet name="header">  
                <h:outputText value="DDI" />  
            </f:facet>  
            <h:outputText value="#{Estado.pais.descricao}" />  
        </p:column>  
        
        <p:column style="width:4%; text-align:center;">  
        	<f:facet name="header">
        	 	<h:outputText value="Adicionar" />
        	</f:facet>
         	<p:commandButton id="selectButtonEditar" actionListener="#{cidadeBean.selectEstado}" 
         					    process="@this" icon="ui-icon-circle-plus" title="Add" />
        </p:column> 
    </p:dataTable>   

 </h:form>
<ui:include src="/view/cidade/dialogManterEstado.xhtml"></ui:include>
</p:dialog>
